import React from 'react'
import ReactDOM from 'react-dom'
import { Collection } from 'react-virtualized'
import { Link, IndexLink } from 'react-router'
import * as AssetAction  from '../../actions/AssetAction';
import { connect }  from 'react-redux';
import AssetGridCell from './AssetGridCell'


class AssetSettingGrid extends React.Component {

  constructor(props) {
    super(props)

    this.cellWidth = this.cellHeight = 200;
    this.margin = 20;

    this.list = [];
    for (var i = 0; i < 20; i++) {
      this.list.push({
        "id": i,
        "created_at": "2016年6月15日",
        "title": "旅行中, 如何在朋友圈优雅地秀人生",
        "image": "/public/img/asset_image.png",
        "digest": "端午小假期终于要到了"
      })
    }
  }

  componentDidMount() {

  }

  componentDidUpdate() {
    // console.log(this.props)
  }

  onAssetDelete(e, asset) {

  }

  renderCell() {
    var self = this;
    return this.list.map(function(data) {
      return(
        <AssetGridCell
          data={data}
          onAssetDelete = {self.onAssetDelete.bind(self)}
        />
      )
    })
  }

  render() {
    var self = this;
    return (
      <div className="row asset-grid">
        <div className="asset-button">
          <Link to="/assetsettingeditor" className="asset-create-btn"> 新建图文消息
          </Link>
        </div>
        {self.renderCell()}
      </div>
    )
  }
}

const mapStateToProps = (state, ownProps) => {
  return { assets: state.assets }
}

export default connect(mapStateToProps)(AssetSettingGrid)
